<template>
  <div class="JointInspection-report">
    <div class="JointInspection-report-btn">
      <el-button
        class="table-query"
        type="primary"
        @click="alarm"
      >告警推送</el-button>
      <el-button
        class="table-query"
        type="primary"
        @click="refreshReport"
      >刷新报告</el-button>
      <el-button
        class="table-query"
        type="primary"
        @click="alarm"
      >导出采集信息图片</el-button>
      <el-button
        class="table-query"
        type="primary"
        @click="exportExcel"
      >导出Excel报告</el-button>
    </div>
    <div class="JointInspection-report-con">
      <el-collapse >
        <el-collapse-item  >
          <template slot="title">
            <div class="report-title">&nbsp;&nbsp;一 &nbsp;基本信息</div>
          </template>
          <basicInfo :xjxxhzTotals='xjxxhzTotals' :ycxjxxTatals='ycxjxxTatals' :ylxjxxTatals='ylxjxxTatals' :rgsbxxTatals='rgsbxxTatals'  :Manipulation='Manipulation' />
        </el-collapse-item>
      </el-collapse>
      <el-collapse>
        <el-collapse-item>
          <template slot="title">
            <div class="report-title">&nbsp;&nbsp;二 &nbsp;异常巡检信息</div>
          </template>
          <abnormal ref="mychildAbnormal" @ycxjxxTatal='ycxjxxTatal' :qvxl='qvxl' :Manipulation='Manipulation' :jgdy='jgdy' />
        </el-collapse-item>
      </el-collapse>
      <el-collapse>
        <el-collapse-item>
          <template slot="title">
            <div class="report-title">&nbsp;&nbsp;三 &nbsp;遗漏巡检信息</div>
          </template>
          <ylxjxx ref="mychildYlxjxx" @ylxjxxTatal='ylxjxxTatal' :qvxl='qvxl' :Manipulation='Manipulation' :jgdy='jgdy' />
        </el-collapse-item>
      </el-collapse>
      <el-collapse>
        <el-collapse-item>
          <template slot="title">
            <div class="report-title">&nbsp;&nbsp;四 &nbsp;人工识别信息</div>
          </template>
          <rgsxx ref="mychildRgsxx" @rgsbxxTatal='rgsbxxTatal' :qvxl='qvxl' :Manipulation='Manipulation' :jgdy='jgdy'/>
        </el-collapse-item>
      </el-collapse>
      <el-collapse>
        <el-collapse-item>
          <template slot="title">
            <div class="report-title">&nbsp;&nbsp;五 &nbsp;主设备自动校对信息</div>
          </template>
          <zsbzdxdxx   ref="mychildZsbzdxdxx" :qvxl='qvxl' :Manipulation='Manipulation' :jgdy='jgdy'/>
        </el-collapse-item>
      </el-collapse>
      <el-collapse>
        <el-collapse-item>
          <template slot="title">
            <div class="report-title">&nbsp;&nbsp;六 &nbsp;在线监测自动校对信息</div>
          </template>
          <zxjczdxdxx  ref="mychildZxjczdxdxx" :qvxl='qvxl' :Manipulation='Manipulation' :jgdy='jgdy' />
        </el-collapse-item>
      </el-collapse>
      <el-collapse>
        <el-collapse-item>
          <template slot="title">
            <div class="report-title">&nbsp;&nbsp;七 &nbsp;巡检信息汇总</div>
          </template>
          <xjxxhz  ref="mychildXjxxhz" @xjxxhzTotal='xjxxhzTotal' :qvxl='qvxl' :Manipulation='Manipulation' :jgdy='jgdy' />
        </el-collapse-item>
      </el-collapse>
    </div>
  </div>
</template>

<script lang="ts">
import { Component, Vue, Prop } from "vue-property-decorator";
//basicInfo 基本信息   abnormal异常巡检信息
import { basicInfo, abnormal } from "./reportcom/index";
import ylxjxx from "./reportcom/ylxjxx.vue"; //遗漏巡检信息
import rgsxx from "./reportcom/rgsxx.vue"; // 人工识信息  
import zsbzdxdxx from "./reportcom/zsbzdxdxx.vue"; // 主设备自动校对信息
import zxjczdxdxx from "./reportcom/zxjczdxdxx.vue"; // 在线监测自动校对信息 
import xjxxhz from "./reportcom/xjxxhz.vue"; // 巡检信息汇总

@Component({ components: { basicInfo, abnormal ,ylxjxx,rgsxx,zsbzdxdxx,zxjczdxdxx,xjxxhz} })
export default class extends Vue {
  @Prop()
  Manipulation: any;
  public qvxl=[]  //巡检区域下拉
  jgdy:any=[] //间隔单元下拉
  alarm() {}
  //刷新报告
  refreshReport(){
    (this as any).$refs.mychildAbnormal.init();
    (this as any).$refs.mychildYlxjxx.init();
    (this as any).$refs.mychildRgsxx.init();
    (this as any).$refs.mychildZsbzdxdxx.init();
    (this as any).$refs.mychildZxjczdxdxx.init();
    (this as any).$refs.mychildXjxxhz.init();
  }
  init(){
    (this as any).$services
          .getQyData({ data: {jhid:this.Manipulation.ID,jhlx:'',xslx:this.Manipulation.XSLX } })
          .then((result: any) => {
            this.qvxl=result.data
            // console.log(result);
          })
          .catch((err: object) => {
            console.log(err);
          });
    (this as any).$services
          .getJgData({ data: {jhid:this.Manipulation.ID,jhlx:'',xslx:this.Manipulation.XSLX } })
          .then((result: any) => {
            this.jgdy=result.data
            // console.log(result);
          })
          .catch((err: object) => {
            console.log(err);
          });
  }
  // astatus=false
  //巡检信息汇总 总数
  xjxxhzTotals=''
  xjxxhzTotal(val){
    this.xjxxhzTotals= val
    // this.astatus = true
    // console.log(val);
  }
  ycxjxxTatals=''
  //异常巡检信息 总数
  ycxjxxTatal(val){
    this.ycxjxxTatals=val
    // console.log(val);
  }
   //遗漏巡检信息 总数
   ylxjxxTatals=''
  ylxjxxTatal(val){
    this.ylxjxxTatals=val
    // console.log(val);
  }
   //人工识别信息 总数
   rgsbxxTatals=''
  rgsbxxTatal(val){
    this.rgsbxxTatals=val
    // console.log(val);
  }
  //导出Excel
  exportExcel(){
    var form:any={};
    form.jhid=this.Manipulation.ID || '';
    form.xslx=this.Manipulation.XSLX ||'';
    form.jhlx='';
    (this as any).$services
          .exportExcel({ data:form })
          .then((result: any) => {
            // console.log(result);
          })
          .catch((err: object) => {
            console.log(err);
          });
    
  }
  mounted() {
    // console.log(this.Manipulation);
    
    this.init()
  }
}
</script>

<style lang="scss" scoped>
.JointInspection-report {
  width: 100%;
  height: 70vh;
  .JointInspection-report-btn {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    height: 40px;
  }
  .JointInspection-report-con {
    width: 100%;
    height: calc(100% - 40px);
    overflow-y: auto;
  }
  .report-title {
    font-size: 0.2rem;
    font-weight: 400;
  }
}
</style>
<style lang="scss">
.JointInspection-report {
  .el-collapse {
    border: none;
    background: #002279;
    margin-bottom: 0.1rem;
  }
  .el-collapse-item__header,
  .el-collapse-item__wrap {
    border: none;
  }
}
</style>

